DOM获取元素(八种方法) | 您所在的位置:网站首页 › angularelement 获取元素 › DOM获取元素(八种方法) |
DOM获取元素
8种方案(两静态四动态两特殊)
1. 两个静态获取 一下两种方法不具有 实时性(只能获取页面已经存在的元素) 使用 css 选择器 进行选择(.类名) 1.1 querySelector document.querySelector(‘选择器’)在指定上下文中通过选择器获取第一个元素(只能获取一个),获取不到就是null 1.2 querySelectorAll document.querySelectorAll(‘选择器’)在指定上下文中通过选择器获取一组元素集合,获取不到就是空元(通过数组方法取元素) 2. 四个动态获取2.1 getElementById document.getElementByid('id名') 在document上下文下获取元素(通过Id获取的元素是一个元素对象,获取不到就是null) 2.2getElementByTagName document.getElementByTagName(‘标签名’)通过指定的上下文获取指定的标签,获取的是一个元素集合,如果没有获取到元素,那就是空元素集合 (通过数组方法取元素) 2.3 getElementByName document.getElementByName(‘标签名’)在整个文档中,通过标签的NAME属性值获取一组节点集合(在IE中只有表单元素的NAME才能识别,所以我们一般应用于表单元素的处理) 2.4 getElementClassName document.getElementClassName(‘类名’)通过指定的上下文或按照class名取指定的标签,获取的是一个元素集合,如果没有获取到元素,那就是空元素集合 (通过数组方法取元素) 3.两个特殊获取 3.1 document.body var body=document.body; console.log(body);body 属性用于设置或返回文档体。 如果是返回, 该属性返回当前文档的 body 元素。 如果是设置, 该属性会覆盖所有在 body 元素中的子元素, 并用新的内容来替换它。 3.2 document.documentElement var html=document.documentElement; console.log(html);documentElement 属性以一个元素对象返回一个文档的文档元素。 HTML 文档返回对象为HTML元素。 注意: 如果 HTML 元素缺失,返回值为 null。 4.动态获取中id获取器动态获取里面 id 得先存在 在获取 id获取器是一个特殊的方法,可以不用变量接收通过id获取的值,直接用id名称调用 console.log(box); |
CopyRight 2018-2019 实验室设备网 版权所有 |